<template>
    <div class="preview-wrap" v-show="show" v-on:click="closePreview">
      <div class="preview" id="pageView">
        <div class="wk-box" v-bind:class="this.$pageView.skin">
          <div class="page-title">{{this.$pageView.title}}</div>
          <div class="page-describe">{{this.$pageView.describe}}</div>
          <div :id="item.id" :is="item.component" v-if="item" :obj="item" v-for="(item, i) in this.$pageView.formItems" :key="i"></div>
        </div>
      </div>
    </div>
</template>

<script>
import address from './libs/address'
import checkbox from './libs/checkbox'
import date from './libs/date'
import time from './libs/time'
import datetime from './libs/datetime'
import email from './libs/email'
import hr from './libs/hr'
import input from './libs/input'
import inputCurrency from './libs/input-currency'
import inputNumber from './libs/input-number'
import page from './libs/page'
import radio from './libs/radio'
import select from './libs/select'
import selectMulti from './libs/select-multi'
import tableDefault from './libs/table-default'
import tableLeft from './libs/table-left'
import tableTop from './libs/table-top'
import tel from './libs/tel'
import textarea from './libs/textarea'
import upatta from './libs/upatta'
import upimg from './libs/upimg'
import word from './libs/word'
import place from './libs/place'

export default {
  props:['show'],
  components: {
    'v-address': address,
    'v-checkbox': checkbox,
    'v-date': date,
    'v-time': time,
    'v-datetime': datetime,
    'v-email': email,
    'v-hr': hr,
    'v-input': input,
    'v-input-currency': inputCurrency,
    'v-input-number': inputNumber,
    'v-page': page,
    'v-radio': radio,
    'v-select': select,
    'v-select-multi':selectMulti,
    'v-table-default': tableDefault,
    'v-table-left': tableLeft,
    'v-table-top': tableTop,
    'v-tel': tel,
    'v-textarea': textarea,
    'v-upatta': upatta,
    'v-upimg': upimg,
    'v-word': word,
    'v-place':place
  },
  methods:{
    closePreview:function(event){
      if(event.target.className == 'preview-wrap'){
        this.$emit('showPreview',false)
      }
    }
  }
}
</script>